<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>充电终端管理</title>
    <link rel="stylesheet" type="text/css" href="/themes/default/easyui.css" id="swicth-style">
    <link rel="stylesheet" type="text/css" href="/css/icon.css">
    <link rel="stylesheet" type="text/css" href="/css/common.css">
    <link rel="stylesheet" type="text/css" href="/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="/themes/color.css">
    <script type="text/javascript" src="/js/jquery.min.js"></script>
    <script type="text/javascript" src="/js/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="/js/jquery.cookie.js"></script>
    <script type="text/javascript" src="/js/easyui-lang-zh_CN.js"></script>
    <script type="text/javascript" src="/js/common.js"></script>
</head>

<body class="easyui-layout" style="padding:5px;">
<fieldset>
    <legend>信息查询</legend>
    <form id="ffSearch" method="post">
        <div id="searchBar">
            <table cellspacing="0" cellpadding="0">
                <tr>
                    <th>机器码：</th>
                    <td style="width:120px">
                        <input name="machineCode" class="easyui-textbox" type="text" style="width:100px">
                    </td>
                    <th>业务码：</th>
                    <td style="width:120px">
                        <input name="businessCode" class="easyui-textbox" type="text" style="width:100px">
                    </td>
                    <th>终端状态：</th>
                    <td style="width:120px">
                        <select id="statusSelect" name="status" class="easyui-combobox" data-options="onSelect: function(rec){onSearch()}" style="width:100px">
                            <option value="0">全部</option>
                            <option value="1">启用</option>
                            <option value="2">禁用</option>
                        </select>
                    </td>
                    <td colspan="2">
                        <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-search'" onclick="onSearch()">查询</a>&nbsp;&nbsp;
                        <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-clear'" onclick="onClear()">重置</a>
                    </td>
                </tr>
            </table>
        </div>
    </form>
</fieldset>

<table id="dg"> </table>

<div id="addOrEdit" class="easyui-window" title="添加终端" data-options="closed:true,iconCls:'icon-save',footer:'#ft'" style="width:450px;height:300px;padding:10px;">
    <form id="ff" method="post">
        <table class="table-blue">
            <tr>
                <th>机器码：</th>
                <td><input type="hidden" name="id"/><input class="easyui-validatebox textbox" type="text" name="machineCode" data-options="required:true, validType:'maxLength[50]'"/></td>
            </tr>
            <tr>
                <th>业务码：</th>
                <td><input class="easyui-validatebox textbox" type="text" name="businessCode" data-options="required:true, validType:'maxLength[50]'"/></td>
            </tr>
            <tr>
                <th>备注：</th>
                <td><input class="easyui-validatebox textbox" name="remarks" data-options="multiline:true, validType:'maxLength[500]'" style="height:60px;"/></td>
            </tr>
        </table>
    </form>
    <div id="ft" style="padding:5px;text-align: right;">
        <a class="easyui-linkbutton" data-options="iconCls:'icon-ok'" href="javascript:void(0)" onclick="submitForm()" style="width:80px">Ok</a> &nbsp;&nbsp;
        <a class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" href="javascript:void(0)" onclick="closeWindow()" style="width:80px">Cancel</a>
    </div>
</div>

<div id="pop" class="pop" style="display:none">
    <div class="pop_head"><a href="javascript:void(0);" onclick="hide()">关闭</a></div>
    <div class="pop_body"><img id="img_a" src="" alt=""/></div>
</div>

<div id="fileup" class="easyui-window" title="导入Excel" data-options="closed:true,iconCls:'icon-save',footer:'#fileaa'" style="width:450px;height:300px;padding:10px;">
    <form id="fileff" method="post" enctype="mutipart/form-data">
        <table class="table-blue">
            <tr>
                <td width="25%" align="right">上传文件：</td>
                <td><input id="file" type="file" name="file" style="width:300px;"></td>
            </tr>
        </table>
    </form>
    <div id="fileaa" style="padding:5px;text-align: right;">
        <a class="easyui-linkbutton" data-options="iconCls:'icon-ok'" href="javascript:void(0)" onclick="submitFile()" style="width:80px">Ok</a> &nbsp;&nbsp;
        <a class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" href="javascript:void(0)" onclick="closeWindow()" style="width:80px">Cancel</a>
    </div>
</div>

<script type="text/javascript">
    $(function(){
        var dg = $('#dg').datagrid();
        dg.datagrid({
            url:'/v1/api0/equipment/terminalList',
            idField:'id',
            columns:[[
                {field:'id',checkbox:true},
                {field:'machineCode',title:'机器码',width:100},
                {field:'businessCode',title:'业务码',width:100},
                {field:'remarks',title:'备注',width:100},
                {field:'qrCode',title:'二维码',width:100,formatter: function(value,row,index){
                        if(row.qrCode != null && row.qrCode != ""){
                            return '<a href="javascript:void(0)" class="easyui-linkbutton" onclick="show(\''+row.businessCode+'\')">查看</a>';
                        }
                    }},
                {field:'qrCodeUrl',title:'二维码请求地址',width:100},
                {field:'createTime',title:'创建时间',width:100,formatter: formatDateTime},
                {field:'status',title:'状态',width:100,formatter: function(value,row,index){
                    switch(value) {
                        case 1: return "启用";
                        case 2: return "禁用";
                    }
                }},
                {field:'action',title:'操作',width:100,formatter: function(value,row,index){
                        if(row.status == 1){
                            return '<a href="javascript:void(0)" class="easyui-linkbutton" onclick="disable(\''+row.id+'\')">禁用</a> |' +
                                    '<a href="javascript:void(0)" class="easyui-linkbutton" onclick="edit(\''+index+'\')">修改</a> ';
                        }else{
                            return '<a href="javascript:void(0)" class="easyui-linkbutton" onclick="enable(\''+row.id+'\')">启用</a> |' +
                                    '<a href="javascript:void(0)" class="easyui-linkbutton" onclick="edit(\''+index+'\')">修改</a> ';
                        }
                }}
            ]],
            title:'终端管理',
            pagination: true,
            iconCls: 'icon-application_view_detail',
            singleSelect: false,
            toolbar: [{
                id: 'btnAdd',
                text: '添加',
                iconCls: 'icon-add',
                handler: function () {
                    add();
                }
            }, '-', {
                id: 'btnDelete',
                text: '禁用',
                iconCls: 'icon-remove',
                handler: function () {
                    batchDisable();
                }
            }, '-', {
                id: 'btnDelete',
                text: '启用',
                iconCls: 'icon-remove',
                handler: function () {
                    batchEnable();
                }
            },'-', {
                id: 'btnReload',
                text: '刷新',
                iconCls: 'icon-reload',
                handler: function () {
                    $("#dg").datagrid("reload");
                }
            }, '-', {
                id: 'batchAdd',
                text: '批量生成二维码',
                iconCls: 'icon-add',
                handler: function () {
                    batchAddQrCode();
                }
            }, '-', {
                id: 'batchAdd',
                text: '批量下载二维码',
                iconCls: 'icon-download',
                handler: function () {
                    batchDownlodeQRCode();
                }
            }, '-', {
                id: 'import',
                text: '导入Excel',
                iconCls: 'icon-add',
                handler: function () {
                    fileUp();
                }
            }]
        });

        var heightMargin = $("#searchBar").height() + 45;
        $('#dg').resizeDataGrid(heightMargin, 0, 0, 0);
        $(window).resize(function() {
            $('#dg').resizeDataGrid(heightMargin, 0, 0, 0);
        });
    });

    function onSearch(){
        var queryParams = $('#ffSearch').serializeObject();

        $('#dg').datagrid({
            url:'/v1/api0/equipment/terminalList',
            queryParams: queryParams
        });
    }

    function onClear() {
        $('#ffSearch').form('clear');
        $('#statusSelect').combobox('setValue', '0');
        onSearch();
    }

    function add() {
        $('#ff').form('clear');
        $("#ff input[name='id']").val("");
        $('#addOrEdit').window({title:'添加终端'});
        $('#addOrEdit').window('open');
    }

    function edit(index) {
        $('#ff').form('clear');
        var row = $('#dg').datagrid('getData').rows[index];
        $('#ff').form('load',row);
        $("#ff input[name='id']").val(row.id);
        $('body').data('ff-serialize', $('#ff').serialize());
        $('#addOrEdit').window({title:'编辑充电终端'});
        $('#addOrEdit').window('open');
    }

    function submitForm(){
        var id = $("#ff input[name='id']").val();
        var url = id.length ? "/v1/api0/equipment/editTerminal" : "/v1/api0/equipment/addTerminal";
        var data = $('#ff').serialize();
        if(data == $('body').data('ff-serialize')) {
            top.window.showMessage("数据没有改动");
            return;
        }
        $.ajax({
            type: "post",
            url: url,
            data: data,
            datatype: "json",
            beforeSend: function () {
                if (!$('#ff').form('validate')){
                    return false;
                }
                $('#dg').datagrid('loading');
            },
            success: function (data) {
                if(data.code == 200) {
                    $('#dg').datagrid('reload');
                    top.window.showMessage();
                    closeWindow();
                } else {
                    top.window.showMessage(data.msg);
                    $('#dg').datagrid('loaded');
                }
            },
            error: function () {
                $('#dg').datagrid('loaded');
            }
        });
    }

    function batchAddQrCode() {
        var ids = [];
        var rows = $('#dg').datagrid('getSelections');
        if(!rows.length) {
            top.window.showMessage("请选择设备");
            return;
        }
        for (var i = 0; i < rows.length; i++) {
            ids.push(rows[i].id);
        }

        top.window.$.messager.confirm('确认', '您确定要生成二维码吗？', function(r){
            if (r){
                var url = "/v1/api0/equipment/batchAddTerminalQrCode";
                var data = {ids: ids.join(',')};
                $.ajax({
                    type: "get",
                    url: url,
                    data: data,
                    datatype: "json",
                    async: false,
                    beforeSend: function () {
                        $('#dg').datagrid('loading');
                    },
                    success: function (data) {
                        if(data.code == 200) {
                            $('#dg').datagrid('reload');
                            top.window.showMessage();
                            closeWindow();
                        } else {
                            top.window.showMessage(data.msg);
                            $('#dg').datagrid('loaded');
                        }
                    },
                    error: function () {
                        $('#dg').datagrid('loaded');
                    }
                });
            }
        });
    }

    function fileUp() {
        $('#fileff').form('clear');
        $('#fileup').window({title:'导入Excel'});
        $('#fileup').window('open');
    }

    function submitFile(){
        var url = "/v1/api0/equipment/importTerminalExcel";
        var formData = new FormData($('#fileff')[0]);
        $.ajax({
            type: "post",
            url: url,
            data: formData,
            processData: false,
            contentType: false,
            async: false,
            beforeSend: function () {
                $('#dg').datagrid('loading');
            },
            success: function (data) {
                if(data.code == 200) {
                    $('#dg').datagrid('reload');
                    top.window.showMessage();
                    closeWindow();
                } else {
                    top.window.showMessage(data.msg);
                    $('#dg').datagrid('loaded');
                }
            },
            error: function () {
                $('#dg').datagrid('loaded');
            }
        });
    }

    function closeWindow(){
        $('#addOrEdit').window('close');
        $('#bind').window('close');
        $('#fileup').window('close');
    }

     function batchDisable() {
        var ids = [];
        var rows = $('#dg').datagrid('getSelections');
        if(!rows.length) {
            top.window.showMessage("请选择终端");
            return;
        }
        for (var i = 0; i < rows.length; i++) {
            ids.push(rows[i].id);
        }

        top.window.$.messager.confirm('确认', '您确定要禁用选择的终端吗？', function(r){
            if (r){
                var url = "/v1/api0/equipment/batchDisableTerminal";
                var data = {ids: ids.join(',')};
                $.ajax(ajaxOption(url, data));
            }
        });
    }

    function batchEnable() {
        var ids = [];
        var rows = $('#dg').datagrid('getSelections');
        if(!rows.length) {
            top.window.showMessage("请选择终端");
            return;
        }
        for (var i = 0; i < rows.length; i++) {
            ids.push(rows[i].id);
        }

        top.window.$.messager.confirm('确认', '您确定要启用选择的终端吗？', function(r){
            if (r){
                var url = "/v1/api0/equipment/batchEnableTerminal";
                var data = {ids: ids.join(',')};
                $.ajax(ajaxOption(url, data));
            }
        });
    }

    function batchDownlodeQRCode() {
        var ids = [];
        var rows = $('#dg').datagrid('getSelections');
        if(!rows.length) {
            top.window.showMessage("请选择终端");
            return;
        }
        top.window.$.messager.confirm('确认', '确定下载吗？', function(r){
            if (r){
            var name ;
            for (var i = 0; i < rows.length; i++) {
                if(rows[i].qrCode!= null&& rows[i].qrCode != ""&& rows[i].qrCode!='null'){
                <!--location.href = serverPath+'/GetFile?bt=staticInfoImage&fn='+rows[i].businessCode+'.png&sd=qrcodeImage/&pt='+rows[i].businessCode+'.png';-->
                if(name==null||name=="null"||name ==undefined){
                name = rows[i].businessCode+".png";}
                else{
                name = name +","+rows[i].businessCode+".png";}
                }
            }
            location.href = "/v1/api0/equipment/qrDownload?filenames="+name;
                <!--$.ajax({-->
                <!--type:'post',-->
                <!--url:'/v1/api0/equipment/qrDownload',-->
                <!--data:{filenames:name},-->
                <!--success:function(data){-->
                <!--top.window.showMessage(data.msg);-->
                <!--alert("文件已存放至D:/Download/Qrcode文件夹！");-->
                <!--},-->
                <!--error:function(data){-->
                <!--top.window.showMessage(data.msg);-->
                <!--alert("文件已存放至D:/Download/Qrcode文件夹！");-->
                <!--}-->
                <!--});-->
            }
        });
    }


   /* function disable(id){
        alert("============"+id);
        var url = "/v1/api0/equipment/disableTerminal";
        var data = {id: id};
        $.ajax(ajaxOption(url, data));
    }*/

    function disable(id) {
     top.window.$.messager.confirm('确认', '您确定要禁用该终端吗？', function(r){
            if (r){
                var url = "/v1/api0/equipment/disableTerminal";
        var data = {id: id};
        $.ajax(ajaxOption(url, data));
            }
        });
    }


    function enable(id) {
    top.window.$.messager.confirm('确认', '您确定要启用该终端吗？', function(r){
            if (r){
                 var url = "/v1/api0/equipment/enableTerminal";
        var data = {id: id};
        $.ajax(ajaxOption(url, data));
            }
        });
    }

    function ajaxOption(url, data) {
        return {
            type: "post",
            url: url,
            data: data,
            datatype: "json",
            beforeSend: function () {
                $('#dg').datagrid('loading');
            },
            success: function (data) {
                if(data.code == 200) {
                    $('#dg').datagrid('reload');
                    top.window.showMessage();
                    closeWindow();
                } else {
                    top.window.showMessage(data.msg);
                    $('#dg').datagrid('loaded');
                }
            },
            error: function () {
                $('#dg').datagrid('loaded');
            }
        }
    }

    var EX = {
        addEvent:function(k,v){
            var me = this;
            if (me.addEventListener)
                me.addEventListener(k, v, false);
            else if(me.attachEvent)
                me.attachEvent("on" + k, v);
            else
                me["on" + k] = v;
        },
        removeEvent:function(k,v){
            var me = this;
            if (me.removeEventListener)
                me.removeEventListener(k, v, false);
            else if (me.detachEvent)
                me.detachEvent("on" + k, v);
            else
                me["on" + k] = null;
        },
        stop:function(evt){
            evt = evt || window.event;
            evt.stopPropagation?evt.stopPropagation():evt.cancelBubble=true;
        }
    };
    document.getElementById('pop').onclick = EX.stop;
    var url = '#';
    function show(imgname){

        var o = document.getElementById('pop');
        o.style.display = "";
        $("#img_a").attr("src",serverPath+'/GetImage?bt=staticInfoImage&fn='+imgname+'.png'+'&sd=qrcodeImage/');
        setTimeout(function(){EX.addEvent.call(document,'click',hide);});
    }
    function hide(){
        var o = document.getElementById('pop');
        o.style.display = "none";
        EX.removeEvent.call(document,'click',hide);
    }
</script>
</body>
</html>
